import React, { useState } from "react"
import Page from "@/components/layout/page/Page"
import { Form, Button } from "antd"

import UniversalUpload from "@/components/upload/UniversalUpload"
const Test004 = () => {
  const [fileList, serFileList] = useState([])
  const [form] = Form.useForm()
  const selItem = (arr, key) => arr.map((item) => item[key])

  const getFileInfo = (r) => {
    serFileList(() => selItem(r, "url"))
  }

  const onFinish = () => {
    console.log(fileList)
  }

  return (
    <Page>
      <div className="w-400px">
        <Form form={form} colon={false} onFinish={onFinish}>
          <Form.Item name="orderNo" valuePropName="fileList">
            <UniversalUpload getFileInfo={getFileInfo} listType="picture-card" />
          </Form.Item>
          <Button type="primary" htmlType="submit">
            Submit
          </Button>
        </Form>
      </div>
    </Page>
  )
}

export default Test004
